<template>
	<div style="overflow: auto;">
		
		<div class="form" style="overflow: auto;">
			<el-form ref="form" label-position="left" :model="form" label-width="140px">
				<el-form-item label="服务类型">
					<el-input v-model="form.name"></el-input>
				</el-form-item>
				<el-form-item label="服务名称">
					<el-input v-model="form.name"></el-input>
				</el-form-item>
				<el-form-item label="保障色">
					<el-color-picker v-model="form.typeColor"></el-color-picker>
				</el-form-item>
				<el-form-item label="禁止参保店铺" >
					<el-transfer v-model="value" :data="data"></el-transfer>
				</el-form-item>
				
				<el-form-item label="保障描述">
					<el-input type="textarea" v-model="form.describe"></el-input>
				</el-form-item>
				<el-form-item label="保障状态">
					<el-select v-model="form.state" placeholder="请选择活动区域">
						<el-option label="正常" value="0"></el-option>
						<el-option label="暂停" value="1"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="onSubmit">立即创建</el-button>
					<el-button>取消</el-button>
				</el-form-item>
				
				
			</el-form>
			
		</div>
		
		

		<!-- 保障类型 -->

		<!-- 保障色 -->

		<!-- 保障图标 -->

		<!-- 保障名称 -->

		<!-- 保障描述 -->

		<!-- 保障关键词 -->

		<!-- 禁止参与保障的店铺 -->

		<!-- 状态 -->

	</div>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					name: '',	// 保障名称
					typeColor:"",	// 保障色
					describe:""	,// 保障描述
					icon:"",		// 保障图标
					state:""		// 保障状态
				}
			}
		},
		methods: {
			onSubmit() {
				console.log('submit!');
			}
		}
	}
</script>

<style scoped="scoped">
	.form{
		margin-top: 15px;
		margin-left: 15px;
		width: 800px;
		
	}
</style>
